<template>
    <view
        class="animate__animated animate__bounceIn create-btn"
        :style="{ background: background, position: 'fixed', zIndex: 10, right: right, bottom: bottom }"
        @click="handleClick"
    >
        <u-icon name="plus" :color="color" :size="size" />
    </view>
</template>

<script>
export default {
    props: {
        color: {
            type: String,
            default: "#ffffff",
        },
        size: {
            type: String,
            default: "60rpx",
        },
        right: {
            type: String,
            default: "40rpx",
        },
        bottom: {
            type: String,
            default: "282rpx",
        },
        background: {
            type: String,
            default: "linear-gradient(136deg, #6db6ff 0%, #349aff 100%)",
        },
    },
    data() {
        return {};
    },
    methods: {
        handleClick() {
            console.log("点击事件 ");
            this.$emit("click", { a: 1 });
        },
    },
};
</script>

<style>
.create-btn {
    width: 108rpx;
    height: 108rpx;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
</style>
